import 'package:flutter/material.dart';

class DouYinPage extends StatefulWidget {
  const DouYinPage({Key? key}) : super(key: key);

  @override
  _DouYinPageState createState() => _DouYinPageState();
}

class _DouYinPageState extends State<DouYinPage> {
  @override
  Widget build(BuildContext context) {
    double screenWidth = MediaQuery.of(context).size.width;
    double screenHeight = MediaQuery.of(context).size.height;
    return Scaffold(
     
      body: Stack(
        children: [
          Positioned(
            top: 0,
            height: 120,
            width: screenWidth,
            child: Container(
              decoration: BoxDecoration(color: Theme.of(context).primaryColor),
              child: const TopTab(),
            ),
          ),
          Positioned(
            bottom: 0,
            height: 150,
            width: screenWidth * 0.7,
            child: const BtnConten(),
          ),
          Positioned(
            top: 0.3 * screenHeight,
            right: 0,
            height: 0.4 * screenHeight,
            width: screenWidth * 0.25,
            child: Container(
              child: getButtonList(),
            ),
          ),
          Positioned(
            bottom: 0,
            right: 0,
            height: 0.25 * screenWidth,
            width: screenWidth * 0.25,
            child: const RotateAlbum(),
          ),
        ],
      ),
    );
  }
}

class TopTab extends StatefulWidget {
  const TopTab({Key? key}) : super(key: key);

  @override
  _TopTabState createState() => _TopTabState();
}

class _TopTabState extends State<TopTab> with SingleTickerProviderStateMixin {
  late TabController tabController;
  @override
  void initState() {
    super.initState();
    tabController = TabController(length: 2, vsync: this, initialIndex: 1);
  }

  
  @override
  void dispose() { 
    tabController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Row(
      crossAxisAlignment: CrossAxisAlignment.center,
      children: [
        const Expanded(
          flex: 1,
          child: Icon(Icons.search),
        ),
        Expanded(
          flex: 6,
          child: Container(
            padding: const EdgeInsets.symmetric(horizontal: 50),
            child: TabBar(
              indicatorColor: Colors.white,
              labelStyle: const TextStyle(color: Colors.white, fontSize: 18),
              indicatorPadding: const EdgeInsets.symmetric(horizontal: 25),
              unselectedLabelStyle:
                  TextStyle(color: Colors.grey[700], fontSize: 20),
              controller: tabController,
              tabs: const <Widget>[
                Text('关注'),
                Text('推荐'),
               
              ],
            ),
          ),
        ),
        const Expanded(
          flex: 1,
          child: Icon(Icons.live_tv),
        ),
      ],
    );
  }
}

class BtnConten extends StatelessWidget {
  const BtnConten({Key? key}) : super(key: key);

 
  @override
  Widget build(BuildContext context) {
   
    return Column(
      mainAxisSize: MainAxisSize.max,
      children: const [
       ListTile(
          title: Text('@人民日报'),
          subtitle:
              Text('广东省深圳市宝安区福永街道白石厦社区横巷14号新湖公寓'),
        ),
      ],
    );
  }
}

class RotateAlbum extends StatefulWidget {
  const RotateAlbum({Key? key}) : super(key: key);

  @override
  _RotateAlbumState createState() => _RotateAlbumState();
}

class _RotateAlbumState extends State<RotateAlbum>
    with SingleTickerProviderStateMixin {
  late AnimationController controller;
  // ignore: prefer_typing_uninitialized_variables
  var animation;
  @override
  void initState() {
    super.initState();
    controller = AnimationController(
      vsync: this,
      duration: const Duration(seconds: 2),
    );
    animation = RotationTransition(
      turns: Tween(begin: 0.0, end: 1.0).animate(controller)
        ..addStatusListener((status) {
          if (status == AnimationStatus.completed) {
            controller.forward(from: 0.0);
          }
        }),
      child: const Icon(
        Icons.music_note,
        size: 30,
      ),
    );
    controller.forward(from: 0.0);
  }

  @override
  void dispose() { 
    controller.dispose();
    super.dispose();
  }
  @override
  Widget build(BuildContext context) {
    return Container(
      child: animation,
    );
  }
}

getButtonList() {
  return Column(
    crossAxisAlignment: CrossAxisAlignment.center,
    children: [
      SizedBox(
        width: 60,
        height: 70,
        child: Stack(
          children: [
            const SizedBox(
              width: 60,
              height: 60,
              child: CircleAvatar(
                backgroundImage: NetworkImage(
                    'https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=3024387196,1621670548&fm=27&gp=0.jpg'),
              ),
            ),
            Positioned(
              bottom: 0,
              left: 17.5,
              child: Container(
                width: 20,
                height: 20,
                decoration: BoxDecoration(
                  color: Colors.redAccent,
                  borderRadius: BorderRadius.circular(20),
                ),
                child: const Icon(
                  Icons.add,
                  size: 20,
                  color: Colors.white,
                ),
              ),
            ),
          ],
        ),
      ),
      const IconText(
        icon: Icon(
          Icons.favorite,
          size: 45,
          color: Colors.blueAccent,
        ),
        text: Text(
          '999w',
          style: TextStyle(color: Colors.blue),
        ),
      ),
      const IconText(
        icon: Icon(
          Icons.feedback,
          size: 45,
          color: Colors.blueAccent,
        ),
        text: Text(
          '999w',
          style: TextStyle(color: Colors.blue),
        ),
      ),
     
    ],
  );
}

class IconText extends StatelessWidget {
  // ignore: use_key_in_widget_constructors
  const IconText({required this.icon, required this.text});
  final Icon icon;
  final Text text;

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisSize: MainAxisSize.min,
      children: [icon, text],
    );
  }
}
